<template>
  <view v-show="active" class="tz-tab-pane" v-bind="$attrs"><slot /></view>
</template>
<script>
import { inject, computed, ref } from "vue";
export default {
  name: "TzTabPane",
  props: {
    name: {
      type: String,
      default: "",
    },
  },
  setup(props) {
    const rootTabs = inject("rootTabs");
    const index = ref(null);
    const active = computed(() => {
      return rootTabs.currentName.value === (props.name || index.value);
    });

    return {
      active,
    };
  },
};
</script>

<style lang="scss">
.tz-tab-pane {
}
</style>
